import type { InputEmits, InputProps } from 'element-plus'
import { useTableColumnProps } from '/@/hooks/table-column/props'

type ComponentProps = Partial<UnReadonly<InputProps>>

export type ElTableColumnInputProps<
  T extends Record<string, any>,
  P extends keyof T
> = Merge<
  UseTableColumnProps<ComponentProps, T, P>,
  {
    props?: ComponentProps & {
      onChange?: InputEmits['change']
      onInput?: InputEmits['input']
      onUpdateModelValue?: InputEmits['update:modelValue']
    }
  }
>

/**
 * 表格输入框
 * @param prop column.prop
 * @param label column.label
 * @param options tableColumn的其他属性
 * @returns tableColumn props
 */
export function useTableColumnInput<
  T extends Record<string, any>,
  P extends keyof T
>(
  prop: P,
  label: string,
  options: ElTableColumnInputProps<T, P> = {}
) {
  if (!options.props) {
    options.props = {}
  }

  // options.props.prefixPlaceholder = '请输入'
  options.props.placeholder = options.props?.placeholder || `请输入${label}`
  return useTableColumnProps<T, P>(prop, label, {
    ...options,
    showOverflowTooltip: false,
    component: 'el-input'
    // formatter: (row: T) => {
    //   return (
    //     <el-input
    //       {...options.props}
    //       onChange={(value: string) => {
    //         if (options.change) {
    //           options?.change(value, row)
    //         }
    //         if (options?.props?.onChange) {
    //           options?.props.onChange(value)
    //         }
    //       }}
    //       v-model={row[prop]}
    //       // placeholder={placeholder}
    //       // onChange={options.props?.onChange}
    //     />
    //   )
    // }
  })
}
